<template>
  <el-card shadow="navar">
    <el-row :gutter="15">
      <el-form ref="elForm" :model="formData" size="medium" label-width="120px">
        <el-col :span="12">
          <el-form-item label="优惠券名称" prop="couponName">
            <el-input
              v-model.trim="formData.couponName"
              :disabled="disabled"
              placeholder="暂无"
              clearable
              :style="{ width: '100%' }"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="优惠券类别" prop="category">
            <el-select
              v-model.number="formData.category"
              placeholder="暂无"
              clearable
              :disabled="disabled"
              :style="{ width: '100%' }"
            >
              <el-option
                v-for="item in dict.type.coupon_type"
                :key="item.value"
                :label="item.label"
                :value="parseInt(item.value)"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="优惠金额" prop="money">
            <el-input
              v-model.number="formData.money"
              :disabled="disabled"
              placeholder="暂无"
              clearable
              :style="{ width: '100%' }"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="消费金额" prop="conditionMoney">
            <el-input
              v-model.number="formData.conditionMoney"
              :disabled="disabled"
              placeholder="暂无"
              clearable
              :style="{ width: '100%' }"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="是否允许转赠" prop="isTurn">
            <el-radio-group v-model="formData.isTurn">
              <el-radio
                v-for="item in dict.type.coupon_is_turn"
                :disabled="disabled"
                :key="item.value"
                :label="parseInt(item.value)"
                >{{ item.label }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="发放开始时间" prop="sendTimeStart">
            <el-date-picker
              v-model.trim="formData.sendTimeStart"
              :disabled="disabled"
              type="datetime"
              placeholder="暂无"
              value-format="yyyy-MM-dd HH:mm:ss"
              :style="{ width: '100%' }"
              default-time="0:00:00"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="发放结束时间" prop="sendTimeEnd">
            <el-date-picker
              v-model.trim="formData.sendTimeEnd"
              :disabled="disabled"
              type="datetime"
              placeholder="暂无"
              :style="{ width: '100%' }"
              value-format="yyyy-MM-dd HH:mm:ss"
              default-time="0:00:00"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item prop="useTime" label="使用有效期">
            <el-input
              v-model="formData.useTime"
              :disabled="disabled"
              placeholder="暂无"
              clearable
              :style="{ width: '100%' }"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="使用说明" prop="useNotice">
            <el-input
              v-model.trim="formData.useNotice"
              :disabled="disabled"
              type="textarea"
              placeholder="暂无"
              clearable
              :autosize="{ minRows: 4, maxRows: 4 }"
              :style="{ width: '100%' }"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item size="large">
            <el-button @click="goBack">取消</el-button>
          </el-form-item>
        </el-col>
      </el-form>
    </el-row>
  </el-card>
</template>

<script>
import { getCouponById } from '@/api/coupon/manage.js'

export default {
  dicts: ['coupon_type', 'coupon_is_turn', 'coupon_use_time_type'],
  data() {
    return {
      disabled: true,
      formData: {
        couponName: '',
        category: '',
        money: '',
        conditionMoney: '',
        isTurn: '',
        sendTimeStart: '',
        sendTimeEnd: '',
        useTimeType: 1,
        termTime: '',
        useTimeStart: '',
        useTimeEnd: '',
        useNotice: '',
        useTime: '',
      },
    }
  },
  created() {
    this.getCouponById()
  },
  methods: {
    getCouponById() {
      getCouponById({ id: this.$route.params.id }).then((res) => {
        this.formData = res.data
        console.log(this.formData)
        if (res.data.useTimeType == 1) {
          this.formData.useTime =
            res.data.useTimeStart + ' - ' + res.data.useTimeEnd
        } else if (2 && this.formData.useTime != 0) {
          this.formData.useTime = '领取后' + res.data.useTime + '天有效'
        } else {
          this.formData.useTime = '无限期'
        }
      })
    },
    goBack() {
      this.$router.go(-1) // 返回
      //关闭子页面
      this.$store.state.tagsView.visitedViews.splice(
        this.$store.state.tagsView.visitedViews.findIndex(
          (item) => item.path === this.$route.path
        ),
        1
      )
      this.$router.push(
        this.$store.state.tagsView.visitedViews[
          this.$store.state.tagsView.visitedViews.length - 1
        ].path
      )
    },
  },
}
</script>
